<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
<style>
		li {
			list-style: none;
			float: left;
			margin: 5px;
		}
		ul img {
			padding: 20px;
			/*border: 1px solid #000;*/
		}
	</style>	
</head>
<body>
<div>
		<span>头像的类型</span><img src="3.jpg" alt="">
		<ul>
			<li><img src="1.jpg" title="human-male-draw"></li>
			<li><img src="2.jpg" title="plant-male-photo"></li>
			<li><img src="3.jpg" title="animal-draw"></li>
			<li><img src="4.jpg" title="human-female-draw"></li>
			<li><img src="5.jpg" title="plant-female-photo"></li>
			<li><img src="6.jpg" title="view-photo"></li>
			<li><img src="7.jpg" title="human"></li>
			<li><img src="sky.jpg" title="animal-male-draw"></li>
			<li><img src="3.jpg" title="plant"></li>
			<li><img src="11.jpg" title="animal-female-draw"></li>
		</ul>
	</div>
	<script src="jquery-3.3.1.min.js"></script>
	<script>
		$('img[title|=plant]').css('background-color','skyblue');
		// console.log($(''));

	</script>	
</body>
</html>